---
title: Bien démarrer
description: Une basique introduction sur Astro.
i18nReady: true
tableOfContents: false
editUrl: false
next: false
banner:
  content: |
    <a href="https://astro.build/blog/astro-4/">Astro version 4.0 est sortie !</a>
    Êtes-vous prêt à passer à la vitesse supérieure ? <a href="/fr/guides/upgrade-to/v4/">Lire notre guide de mise à niveau</a>.
hero:
  title: Astro Docs
  tagline: "Guides, ressources et références API pour vous aider à construire avec Astro."
  actions:
    - text: Démarrer
      icon: rocket
      link: /fr/install/auto/
      variant: primary
    - text: "Découvrez les caractéristiques d'Astro"
      icon: right-arrow
      link: /fr/concepts/why-astro/
  facepile:
    tagline: "Réalisé par Astro et nos contributeurs open-source."
    linkText: "Rejoignez-nous !"
    link: /fr/contribute/
---

import { CardGrid } from '@astrojs/starlight/components'
import Card from '~/components/Landing/Card.astro'
import ListCard from '~/components/Landing/ListCard.astro'
import SplitCard from '~/components/Landing/SplitCard.astro'
import Discord from '~/components/Landing/Discord.astro'

<CardGrid>
  <Card title="Que construirez-vous avec Astro ?" icon="laptop">
    Découvrez les [thèmes de démarrage Astro](https://astro.build/themes/) pour les blogs, les portfolios, les documents, les landing pages, SaaS, le marketing, les sites e-commerce, et bien plus encore !
  </Card>

  <Card title="Faire une visite guidée" icon="star">
    Complétez notre [Tutoriel de création d'un blog](/fr/tutorial/0-introduction/) pour apprendre les bases et créer votre premier site Astro.
  </Card>

  <SplitCard title="Démarrer un nouveau projet" icon="rocket">
    ```sh
    # créer un nouveau projet avec npm
    npm create astro@latest
    ```

    Notre [guide d'installation](/fr/install/auto/) contient des instructions pas à pas pour installer Astro à l'aide de notre assistant CLI, pour créer un nouveau projet à partir d'un dépôt Astro GitHub existant, et pour installer Astro manuellement.
  </SplitCard>

  <ListCard title="Apprendre" icon="open-book">
    - [Principales caractéristiques d'Astro](/fr/concepts/why-astro/)
    - [Architecture des îles](/fr/concepts/islands/)
    - [Composants astro](/fr/basics/astro-components/)
    - [La syntaxe d'Astro](/fr/basics/astro-syntax/)
  </ListCard>

  <ListCard title="Prolonger" icon="puzzle">
    - [Ajouter des intégrations comme React, et Tailwind](/fr/guides/integrations-guide/)
    - [Créer des collections de contenus sécurisés](/fr/guides/content-collections/)
    - [Améliorer la navigation avec des transitions de vue](/fr/guides/view-transitions/)
    - [Connecter un CMS headless à votre projet](/fr/guides/cms/)
  </ListCard>
</CardGrid>

<Discord title="Vous avez une question ou souhaitez vous impliquer ?" cta="Rejoignez notre Discord"/>
